<!DOCTYPE html>
<html>
<head>
	<title>Example 1</title>
	<meta charset="utf-8" />
	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
	<script src="../src/jquery.preload.js"></script>
	<script>

		$(function(){

			var images = [
				'http://farm4.static.flickr.com/3219/2431886567_c92821aede_o.jpg',
				'http://farm1.static.flickr.com/37/85684217_526797a103_o.jpg',
				'http://farm5.static.flickr.com/4080/4906820567_63fb82fa85_b.jpg',
				'http://farm3.static.flickr.com/2652/4112396574_8e9f7d81a1_b.jpg'
			];

			$.preload(images, 1, function(last){

				for (var i = 0; i < this.length; i++) {
					$('<img height="200" src="' + this[i] + '" alt="" />').appendTo('body');
				}

				if (last) {
					alert('All loaded!');
				}

			});

		});

	</script>
</head>
<body>

	<h1><a href="http://github.com/htmlhero/jQuery.preload">jQuery.preload</a> example 1</h1>

</body>
</html>